<template>
  <Modal :title="title" v-model="visible" width="920" :footer-hide="true" @on-cancel="visible = false">
    <Card>
      <Row><Table :loading="loading" border :columns="columns" :data="subscribersData" sortable="custom" ref="table"></Table></Row>
      <!-- <Row type="flex" justify="end" class="page">
        <Page
            :current="searchForm.pageNum"
            :total="total"
            :page-size="searchForm.pageSize"
            @on-change="changePage"
            @on-page-size-change="changePageSize"
            :page-size-opts="[10, 20, 50]"
            size="small"
            show-total
            show-elevator
            show-sizer
        ></Page>
      </Row> -->
    </Card>
  </Modal>
</template>

<script>
import { getLotteryCallUsers } from '@/api/new.js';
export default {
  name: 'subscribersManage',
  props: {
    value: {
      type: Boolean,
      default: false
    },
    data: {
      type: Object
    }
  },
  data() {
    return {
      visible: this.value,
      title: '',
      submitLoading: false,
      loading: false,
      maxHeight: 510,
      form: {},
      searchForm: {
        // pageNumber: 1,
        // pageSize: 10,
        id: ''
      },
      columns: [
        {
          title: '头像',
          key: 'avatar',
          minWidth: 120,
					align: 'center',
          render:(h,params) => {
            return h("Avatar", {
              props: {
                src: params.row.avatar,
              },
            });
          }
        },
        {
          title: '用户名',
          key: 'username',
          minWidth: 180
        },
        {
          title: '抽奖码',
          key: 'drawCode',
          minWidth: 180
        }
      ],
      subscribersData: [],
      total: 0
    };
  },
  methods: {
    setCurrentValue(value) {
      // console.log(this.form)
      if (value === this.visible) {
        return;
      }
      this.title = '查看订阅用户';
      // 回显
      this.searchForm.id = this.data.id;
      this.init();
      this.visible = value;
    },

    init() {
      getLotteryCallUsers(this.searchForm).then(res => {
        if (res.code === 200) {
          this.subscribersData = res.data;
          // this.total = res.data.total;
        }
      })
    },

    changePage(v) {
      this.searchForm.pageNumber = v;
      this.init();
    },

    changePageSize(v) {
      this.searchForm.pageSize = v;
      this.init();
    },
  },
  watch: {
    value(val) {
      this.setCurrentValue(val);
    },
    visible(value) {
      this.$emit('input', value);
    }
  },
  mounted() {
    // this.init();
  }
};
</script>

<style lang="less">
@import '../../../styles/drawer-common.less';
</style>
